<template>
	<view class="app-setting">
	<!-- 	<UniNavBar :statusBar="true" :border="false" bgcolor="transparent" leftIcon="back" :fixed="true"  backgroundColor="#ffffff" :title="i18n.setting" @clickLeft="back"></UniNavBar> -->
		<view class="list">
			<view class="li" hover-class="hover-transform2" @tap="selectLang">
				<text class="txt">{{i18n.select_lang}}</text>
				<text class="lang_txt">{{getLang == 1 ? i18n.chs_chs : i18n.en_en}}</text>
				<text class="iconfont icon-arrow-right"></text>
			</view>
			<view class="li" hover-class="hover-transform2" @tap="pageto('/pages/modify-login/modify-login')">
				<text class="txt">{{i18n.modify_login}}</text>
				<text class="iconfont icon-arrow-right"></text>
			</view>
			<view class="li" hover-class="hover-transform2" @tap="pageto('/pages/modify-pwd/modify-pwd')">
				<text class="txt">{{i18n.Set_secondary_password}}</text>
				<text class="iconfont icon-arrow-right"></text>
			</view>
			<view class="li" hover-class="hover-transform2"  @tap="pageto('/pages/setting/protocol')">
				<text class="txt">{{i18n.protocol}}</text>
				<text class="iconfont icon-arrow-right"></text>
			</view>
			<view class="li" hover-class="hover-transform2">
				<text class="txt">{{i18n.current_version}}</text>
				<text class="version">{{version?version:'1.0.0'}}</text>
			</view>
		</view>
		<Btn :txt="i18n.exit_login" @tapbtn="exit" backgroundColor="#E93841"></Btn>
		<SwitchLang :isSHow="isSHow" @cancel="cancel"></SwitchLang>
	</view>
</template>

<script>
	import SwitchLang from '@/components/switchlang/switchLang.vue'
	import {pageback, checkLogin, pageto} from '@/common/js/util.js'
	import Btn from '@/components/btn/btn.vue'
	import {mapGetters, mapMutations} from "vuex"
	export default {
		data() {
			return {
				isSHow: false,
				version: ''
			}
		},
		onShow() {
			console.log('11');
			uni.setNavigationBarTitle({
				title:this.getLang==1?'安全设置':'Security Settings'
			})
			// checkLogin(this.getLoginInfo, this.getRequestUrl)
			this._getVersion()
		},
		computed: {
			i18n() {
				return this.$t('message')
			},
			...mapGetters([
				'getLoginInfo',
				'getRequestUrl',
				"getLang"
			])
		},
		methods: {
			pageto(str) {pageto(str)},
			back() {
				pageback()
			},
			cancel() {
				this.isSHow = false
			},
			selectLang() {
				this.isSHow  = true
			},
			exit() {
				let {email, id, incode, password, paypwd, salt, status, token, username, gespwd, yqcode, userpaypwd} = this.getLoginInfo
				let loginfo = {email, id, incode, password, paypwd, salt, status, token:'', username, gespwd, yqcode, userpaypwd}
				this.setLoginInfo(loginfo);
				uni.redirectTo({
					url: '/pages/guide/index'
				})
			},
			_getVersion() {
				// #ifdef APP-PLUS
				this.version = plus.runtime.version
				// #endif
			},
			...mapMutations([
				'setLoginInfo'
			])
		},
		components: {
			Btn,
			SwitchLang
		}
	}
</script>
<style>
	page{
		background-color: #ededed;
	}
</style>
<style lang="scss">
@import '@/common/scss/variable.scss';
@import '@/common/scss/global.scss';
.app-setting {
	.list {
		margin: 20upx 0 200upx;
		.li {
			padding:0 30upx;
			background-color: #FFFFFF;
			border-bottom: 1upx solid $split-line-color2;
			height: 100upx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			.txt {
				font-size: 14px;
				color: $text-gray-color4;
			}
			.lang_txt {
				flex: 1;
				text-align: right;
				font-size: 14px;
				margin-right: -50upx;
			}
			.version {
				flex: 1;
				text-align: right;
				font-size: 12px;
				margin-right: 15upx;
			}
			.iconfont {
				font-size: 15px;
				color: $text-gray-color5;
				width: 88upx;
				height: 88upx;
				line-height: 88upx;
				text-align: right;
			}
		}
	}
}
</style>
